<template>
  <div style="width: 100vw;height: 100vh;overflow: hidden;display: flex">
    <div style="flex: 1;background-color: dodgerblue">
      <el-image style="width: 100%;height: 100%;object-fit: cover;opacity: 80%"
                src="https://www.toopic.cn/public/uploads/small/1718867275650171886727567.jpg"/>
    </div>
    <div class="welcome-tile">
      <div class="welcome-tile-child1th">Hi rabbit</div>
      <div class="welcome-tile-child2th">Would you like to share your life-story with us</div>
    </div>
    <div style="width: 25%;background-color: white">
      <router-view v-slot="{ Component }">
        <transition name="el-fade-in-linear" mode="out-in">
          <component :is="Component" style="height: 100%"/>
        </transition>
      </router-view>
    </div>
  </div>
</template>
<script setup>

</script>
<style lang="scss" scoped>
  @import "@/assets/css/welcome/body.scss";
</style>